<template>
  <div :class="classes">
    <div :class="barConClasses">
      <i :class="`${prefix}-bar`" v-once v-for="i in 8" :key="`trigger-${i}`"></i>
    </div>
  </div>
</template>

<script>
export default {
	name: 'Trigger',
	props: {
		mode: String,
	},
	data() {
		return {
			prefix: 'ivu-split-trigger',
			initOffset: 0,
		}
	},
	computed: {
		isVertical() {
			return this.mode === 'vertical'
		},
		classes() {
			return [this.prefix, this.isVertical ? `${this.prefix}-vertical` : `${this.prefix}-horizontal`]
		},
		barConClasses() {
			return [`${this.prefix}-bar-con`, this.isVertical ? 'vertical' : 'horizontal']
		},
	},
}
</script>

<style lang="less">
@import './index.less';
</style>
